<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <link rel="stylesheet" href="/static/component/pear/css/pear.css" />
    <meta name="viewport" content="width=device-width,user-scalable=no, initial-scale=1">
    <script src="/static/component/layui/layui.js"></script>
    <script src="/static/component/pear/pear.js"></script>
</head>
<body>

<style>
    .layui-form-item-required:before {
        display: inline-block;
        margin-right: 4px;
        color: #f5222d;
        font-size: 14px;
        font-family: SimSun,sans-serif;
        line-height: 1;
        content: "*";
    }
    .login{padding: 15px}
    .loginfrom .layui-form-label{ width: 100%; float: inherit; text-align: left; padding-left: 0px}
    .loginfrom  .layui-input-block {
        margin-left: 0px;
    }
    .login .layui-btn-container i{ display: block}
    .login .layui-btn-container .layui-btn{ width: 60px; height: 60px; line-height: 20px; border-radius: 50%; text-align: center; padding-top: 10px;}
    .login .layui-tab-title{ height: 49px}
    .login .layui-tab-title .layui-this:after { height: 50px;    border-bottom: 3px solid #004BFF;}
    .login .layui-tab-title .layui-this{ font-weight: bold; color: #004BFF}
    .login .layui-tab-title li { line-height: 46px; font-size: 16px; color: #333; padding: 0px; margin-right: 35px;}
    .login .login_con{padding: 20px 25px 20px 25px;}
    .login_container{ display: none}
</style>

    <div class="login" >
{if !empty($usertoken['token'])}
        <div style="width: 100%; position: relative; overflow: hidden"></div>
        <blockquote class="layui-elem-quote layui-text">
            <strong>温馨提示</strong><br>
            你好！<span style="color: #1E9FFF">{$usertoken.user.nickname}</span><br>
            当前你已经登录，将同步保存你的购买记录
        </blockquote>
        <div style="margin-top: 20px">
            <button type="button" onclick="userbutton('/user');" class="layui-btn layui-btn-fluid layui-btn-primary">个人中心</button>
        </div>
        <div style="margin-top: 20px">
            <button type="button"  onclick="userbutton('/user/personal');" class="layui-btn layui-btn-fluid layui-btn-primary">我的资料</button>
        </div>
        <div style="margin-top: 20px">
            <button type="button"  onclick="userbutton('/user/auther');" class="layui-btn layui-btn-fluid layui-btn-primary">系统鉴权</button>
        </div>
        <div style="margin-top: 20px">
            <button type="button"  onclick="userbutton('/user/addon');" class="layui-btn layui-btn-primary layui-btn-fluid">我的应用</button>
        </div>
        <div style="margin-top: 45px">
        <button type="button" onclick="loginout();" class="layui-btn layui-btn-normal layui-btn-fluid"style="background: #056de8">退出登录</button>
        </div>
{else}

        <div class="login_con">
            <div style="margin:5px 0 25px 0;font-size: 20px; font-weight: bold; text-align: center">登录RuiNuo低代码</div>
            <div style="margin:5px 0 15px 0;" class="loginfrom">
                <div class="layui-tab layui-tab-brief">
                    <ul class="layui-tab-title">
                        <li class="layui-this">账号密码登录</li>
                        <li>手机登录</li>
                    </ul>
                    <div class="layui-tab-content">
                        <div class="layui-tab-item layui-show">
                            <form class="layui-form LoginData" action="" method="post">
                                <div class="layui-form-item">
                                    <label class="layui-form-label layui-form-item-required">账号</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="u_name" lay-verify="required" autocomplete="off" placeholder="用户名/邮箱/手机号" class="layui-input">
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <label class="layui-form-label layui-form-item-required">密码</label>
                                    <div class="layui-input-block">
                                        <input type="password" name="u_pass" lay-verify="required" autocomplete="off" placeholder="密码" class="layui-input">
                                    </div>
                                </div>
                                <button type="button" class="layui-btn layui-btn-normal layui-btn-fluid" lay-submit="" lay-filter="loginsave" style="background: #056de8"><i class="layui-icon layui-icon-ok"></i>立即登录</button>
                            </form>
                        </div>
                        <div class="layui-tab-item">
                            <form class="layui-form PhoneData" action="" method="post">
                                <div class="layui-form-item">
                                    <label class="layui-form-label layui-form-item-required">手机号</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="u_phone" lay-verify="required" autocomplete="off" placeholder="请输入你的手机号" class="layui-input">
                                    </div>
                                </div>

                                <div class="layui-form-item">
                                    <label class="layui-form-label layui-form-item-required">验证码</label>
                                    <div class="layui-input-block" style="position: relative">
                                        <input type="text" name="u_code" lay-verify="required" autocomplete="off" placeholder="请输入6位数字" class="layui-input" maxlength="6">
                                        <button type="button" class="layui-btn layui-btn-normal phonebutton" style="position: absolute; right: 0px; top: 0px" onclick="phonecode();">发送验证码</button>
                                    </div>
                                </div>
                                <button type="button" class="layui-btn layui-btn-normal layui-btn-fluid" lay-submit="" lay-filter="Phonesave"  style="background: #056de8"><i class="layui-icon layui-icon-ok"></i>立即登录</button>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        {/if}
    </div>
{php} $t=t(); $t['api']=getBase64encode($t['api']); {/php}

<script>
    var $=layui.jquery,api_url='{$t.api}';
    layui.use(['form','layer','rncontrol'], function(){
        layui.form.on('submit(loginsave)', function()
        {
            layui.layer.load();
            layui.rncontrol.RnAjax(api_url+'/login/loginsave/?t=1', 'post', 'json', $('.LoginData').serialize(),function (res) {
                layui.layer.closeAll('loading');
                layui.layer.msg(res.msg);
                if (res.code=="0")
                {
                   savetoken(res.data);
                }
                return false;
            })
            return false;
        })

        layui.form.on('submit(Phonesave)', function()
        {

            layui.layer.load();
            layui.rncontrol.RnAjax(api_url+'/login/phonesave/?t=1', 'post', 'json', $('.PhoneData').serialize(),function (res) {
                layui.layer.closeAll('loading');
                layui.layer.msg(res.msg);
                if (res.code=="0")
                {
                    savetoken(res.data);
                }
                return false;
            })
            return false;
        })

    });
    function phonecode()
    {
        var u_phone=$('input[name="u_phone"]').val();
        console.log(u_phone)
        if (u_phone=='')
        {
            layui.layer.msg('手机号码必须填写');
            $('input[name=u_phone]').focus();
            return false;
        }

        layui.layer.load();
        layui.rncontrol.RnAjax(api_url+'/login/phonecode/?t=1', 'post', 'json', $('.PhoneData').serialize(),function (res) {
            layui.layer.closeAll('loading');
            layui.layer.msg(res.msg);
            if (res.code=="0")
            {
                $(".phonebutton").removeClass('layui-btn-normal');
                $(".phonebutton").addClass('layui-btn-disabled');
                $(".phonebutton").removeAttr("onclick");
                $(".phonebutton").html("已发送");
            }
            return false;
        })

    }

    function loginout()
    {
        layui.layer.load();
        layui.rncontrol.RnAjax(api_url+'/login/out/?t=1', 'post', 'json', [],function (res) {
            layui.layer.closeAll('loading');
            if (res.code=="0")
            {
                savetoken();
            }
        })
    }


    function  userbutton(url='')
    {
        window.open(api_url+url,'_blank');
    }
    function savetoken(data=[]){
        var usertoken=
        layui.rncontrol.RnAjax('/admin/shop/savetoken', 'post', 'json', data,function (res) {
            parent.layer.close(parent.layer.getFrameIndex(window.name));
            parent.vlocation(res.data);
        })

    }


</script>
</body>
</html>